import cn from 'classnames';
import PropTypes from 'prop-types';
import React from 'react';
import { withRouter } from 'react-router';
import { Link } from 'react-router-dom';
import Icon from '../Icon';
import {
	WEAKNESS_STATUS_MAP,
	AVILIABLE_STATUS_MAP,
	ASSET_STATUS_MAP,
	AVILIABLE_TASK_MAP,
} from '../../../common/constants';
import s from './style.module.css';

function ColSecurityStatus({
	className,
	securityStatus = 'safe',
	warnings,
	level = {},
	warningCount,
	to,
	location,
	taskType,
	tsid,
}) {
	const state = securityStatus || 'safe';
	let label;
	if (taskType === 'asset') {
		label = ASSET_STATUS_MAP[securityStatus];
	} else if (AVILIABLE_TASK_MAP[taskType]) {
		label = AVILIABLE_STATUS_MAP[securityStatus] || 'safe';
	} else {
		label = WEAKNESS_STATUS_MAP[securityStatus];
	}
	const totalWarning = Object.values(level)
		.map(i => i.warningCount)
		.filter(v => v);
	return (
		<div className={cn(className, s.colSecurityStatus, s[taskType], s[state])}>
			<span>{label}</span>
			{(warningCount > 0 || totalWarning.length || warnings.length > 0) && (
				<Link
					to={{
						pathname: to,
						state: { prevPath: location.pathname },
						search: `tsid=${tsid}`,
					}}
					className={s.linkBtn}
				>
					<Icon className={s.linkIcon} type="right-circle" />
				</Link>
			)}
		</div>
	);
}

ColSecurityStatus.propTypes = {
	className: PropTypes.string,
	securityStatus: PropTypes.oneOf(['unknown', 'safe', 'warning']).isRequired,
	warnings: PropTypes.arrayOf(PropTypes.object),
	warningCount: PropTypes.number,
	to: PropTypes.string.isRequired,
	location: PropTypes.shape({
		pathname: PropTypes.string.isRequired,
	}).isRequired,
	taskType: PropTypes.string,
	tsid: PropTypes.string,
};
ColSecurityStatus.defaultProps = {
	className: s.colSecurityStatus,
	securityStatus: 'unknown',
	warnings: [],
	warningCount: 0,
};

export default withRouter(ColSecurityStatus);
